<template>
  <v-dialog
    max-width="400"
    :model-value="modelValue"
    @update:model-value="val => emit('update:modelValue', val)"
  >
    <v-card>
      <v-card-title>{{ title }}</v-card-title>
      <v-card-text>{{ content }}</v-card-text>
      <v-card-actions>
        <v-spacer />
        <v-btn text @click="emit('update:modelValue', false)">取消</v-btn>
        <v-btn color="error" @click="handleConfirm">确认</v-btn>
      </v-card-actions>
    </v-card>
  </v-dialog>
</template>

<script setup lang="ts">
  import { defineEmits, defineProps } from 'vue'

  defineProps({
    modelValue: Boolean,
    title: { type: String, default: '确认操作' },
    content: { type: String, default: '' },
  })
  const emit = defineEmits(['update:modelValue', 'confirm'])

  function handleConfirm () {
    emit('confirm')
    emit('update:modelValue', false)
  }
</script>
